<template>
	<div>
		<Row style="text-align: left;margin-top: 41px;">
			<Col span="12" style="text-align: left;">
			<span style="border-left: 5px solid #517EDB;font-size: 16px;"></span>
			<span style="font-size: 16px;font-weight: 800;margin-left: 41px;">课程安排</span>
			</Col>
		</Row>
		<Row style="padding:35px 40px 0px 45px;width: 100%;">
			<Col span="24" style="text-align: left;display: inline-block;">
			<span style="margin: 0 10px ;">年&nbsp;&nbsp;&nbsp;&nbsp;级：</span>
			<Select v-model="grade" @on-change="gradeChange" style="width: 150px;text-align: center;">
				<Option v-for="item in gradeList" :value="item.value" :key="item.value">{{item.label}}</Option>
			</Select>

			<Button style="float: right;background-color: orange;color: white;font-size: 14px;margin: 0 45px;" @click="addtime">+&nbsp;添加课时</Button>
			</Col>
		</Row>
		<div style="min-height: 300px; padding-bottom:20px ;">
			<Row style="margin:0 auto;margin:20px 45px 5px 45px;color: #666666;border-radius: 10px; background-color: #f0f8ff;padding: 10px 0;">
				<Col span="3" style="text-align: center;width: 9%;">
				<span style="font-size: 16px;">班级</span>
				</Col>
				<Col span="4" style="text-align: center;width: 8%;">
				<span style="font-size: 16px;">总课时</span>
				</Col>
				<Col span="3" style="text-align: center;width: 7%;">
				<span style="font-size: 16px;">语文</span>
				</Col>
				<Col span="3" style="text-align: center;width: 7%;">
				<span style="font-size: 16px;">数学</span>
				</Col>
				<Col span="4" style="text-align: center;width: 7%;">
				<span style="font-size: 16px;">英语</span>
				</Col>
				<Col span="3" style="text-align: center;width: 7%;">
				<span style="font-size: 16px;">政治</span>
				</Col>
				<Col span="3" style="text-align: center;width: 7%;">
				<span style="font-size: 16px;">历史</span>
				</Col>
				<Col span="4" style="text-align: center;width: 7%;">
				<span style="font-size: 16px;">地理</span>
				</Col>
				<Col span="3" style="text-align: center;width: 7%;">
				<span style="font-size: 16px;">物理</span>
				</Col>
				<Col span="3" style="text-align: center;width: 7%;">
				<span style="font-size: 16px;">化学</span>
				</Col>
				<Col span="3" style="text-align: center;width: 7%;">
				<span style="font-size: 16px;">生物</span>
				</Col>
				<Col span="3" style="text-align: center;width: 20%;">
				<span style="font-size: 16px;">操作</span>
				</Col>
			</Row>
			<Row v-for="(item,index) in manageList" :key="item.itemId" style="margin:0 auto;margin:20px 45px 5px 45px;">
				<Col span="3" style="text-align: center;width: 9%;">
				<span style="font-size: 16px;">{{item.classes}}&nbsp;</span>
				</Col>
				<Col span="4" style="text-align: center;width: 8%;">
				<span style="font-size: 16px;">{{item.alltime}}节&nbsp;</span>
				</Col>
				<Col span="3" style="text-align: center;width: 7%;">
				<span style="font-size: 16px;">{{item.chi}}节&nbsp;</span>
				</Col>
				<Col span="3" style="text-align: center;width: 7%;">
				<span style="font-size: 16px;">{{item.shuxue}}节&nbsp;</span>
				</Col>
				<Col span="4" style="text-align: center;width: 7%;">
				<span style="font-size: 16px;">{{item.eng}}节&nbsp;</span>
				</Col>
				<Col span="3" style="text-align: center;width: 7%;">
				<span style="font-size: 16px;">{{item.zhengzhi}}节&nbsp;</span>
				</Col>
				<Col span="3" style="text-align: center;width: 7%;">
				<span style="font-size: 16px;">{{item.lishi}}节&nbsp;</span>
				</Col>
				<Col span="4" style="text-align: center;width: 7%;">
				<span style="font-size: 16px;">{{item.dili}}节&nbsp;</span>
				</Col>
				<Col span="3" style="text-align: center;width: 7%;">
				<span style="font-size: 16px;">{{item.wuli}}节&nbsp;</span>
				</Col>
				<Col span="3" style="text-align: center;width: 7%;">
				<span style="font-size: 16px;">{{item.huaxue}}节&nbsp;</span>
				</Col>
				<Col span="3" style="text-align: center;width: 7%;">
				<span style="font-size: 16px;">{{item.shengwu}}节&nbsp;</span>
				</Col>
				<Col span="4" style="text-align: center;width: 20%;">
				<Col span="4" style="text-align: center;width: 50%;">
				<a style="font-size: 16px;" @click="xkpkedit(index)">编辑&nbsp;</a>
				</Col>
				<Col span="4" style="text-align: center;width: 50%;">
				<a style="font-size: 16px;" @click="xkpkdel(index)">删除&nbsp;</a>
				</Col>
				</Col>
			</Row>
		</div>
		<div v-if="sortSettingHidden" span="10" style=" width: 600px; z-index: 1000;background-color: white;margin:0 auto;position: absolute;top: 200px;left: 0;right: 0;text-align: left;height:550px;border: 1px solid #e9eaec;padding: 50px;border-radius: 15px;">
			<Row style="width: 100%;text-align: center;margin-bottom: 20px;">
				<span style="margin-bottom: 20px;font-size: 21px;">{{title}}</span>
			</Row>
			<Row style="font-size: 15px;">
				<Col style="text-align: center;padding: 10px;">
				<span>班&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;级:</span>
				<Select v-model="addclass" @on-change="addclassChange" style="text-align: center; width: 60%;position: relative;">
					<Option v-for="(item,index) in addclassList" :value="item.label" :key="item.label">{{item.label}}</Option>
				</Select>
				</Col>
				<Row style="width: 100%;">
					<Col style="text-align: center;padding: 10px;width: 33.3%;float: left;">
					<span>语文:</span>
					<Select v-model="chitime" @on-change="chitimeChange" style="text-align: center; width: 50%;position: relative;">
						<Option v-for="(item,index) in chitimeList" :value="item.label" :key="item.label">{{item.label}}</Option>
					</Select>
					<span>节</span>
					</Col>
					<Col style="text-align: center;padding: 10px;width: 33.3%;float: left;">
					<span>数学:</span>
					<Select v-model="mathtime" @on-change="mathtimeChange" style="text-align: center; width: 50%;position: relative;">
						<Option v-for="(item,index) in mathtimeList" :value="item.label" :key="item.label">{{item.label}}</Option>
					</Select>
					<span>节</span>
					</Col>
					<Col style="text-align: center;padding: 10px;width: 33.3%;float: left;">
					<span>英语:</span>
					<Select v-model="engtime" @on-change="engtimeChange" style="text-align: center; width: 50%;position: relative;">
						<Option v-for="(item,index) in engtimeList" :value="item.label" :key="item.label">{{item.label}}</Option>
					</Select>
					<span>节</span>
					</Col>
				</Row>
				<Row style="width: 100%;">
					<Col style="text-align: center;padding: 10px;width: 33.3%;float: left;">
					<span>物理:</span>
					<Select v-model="wulitime" @on-change="wulitimeChange" style="text-align: center; width: 50%;position: relative;">
						<Option v-for="(item,index) in wulitimeList" :value="item.label" :key="item.label">{{item.label}}</Option>
					</Select>
					<span>节</span>
					</Col>
					<Col style="text-align: center;padding: 10px;width: 33.3%;float: left;">
					<span>化学:</span>
					<Select v-model="huaxuetime" @on-change="huaxuetimeChange" style="text-align: center; width: 50%;position: relative;">
						<Option v-for="(item,index) in huaxuetimeList" :value="item.label" :key="item.label">{{item.label}}</Option>
					</Select>
					<span>节</span>
					</Col>
					<Col style="text-align: center;padding: 10px;width: 33.3%;float: left;">
					<span>生物:</span>
					<Select v-model="shengwutime" @on-change="shengwutimeChange" style="text-align: center; width: 50%;position: relative;">
						<Option v-for="(item,index) in shengwutimeList" :value="item.label" :key="item.label">{{item.label}}</Option>
					</Select>
					<span>节</span>
					</Col>
				</Row>
				<Row style="width: 100%;">
					<Col style="text-align: center;padding: 10px;width: 33.3%;float: left;">
					<span>政治:</span>
					<Select v-model="zhengzhitime" @on-change="zhengzhitimeChange" style="text-align: center; width: 50%;position: relative;">
						<Option v-for="(item,index) in zhengzhitimeList" :value="item.label" :key="item.label">{{item.label}}</Option>
					</Select>
					<span>节</span>
					</Col>
					<Col style="text-align: center;padding: 10px;width: 33.3%;float: left;">
					<span>历史:</span>
					<Select v-model="lishitime" @on-change="lishitimeChange" style="text-align: center; width: 50%;position: relative;">
						<Option v-for="(item,index) in lishitimeList" :value="item.label" :key="item.label">{{item.label}}</Option>
					</Select>
					<span>节</span>
					</Col>
					<Col style="text-align: center;padding: 10px;width: 33.3%;float: left;">
					<span>地理:</span>
					<Select v-model="dilitime" @on-change="dilitimeChange" style="text-align: center; width: 50%;position: relative;">
						<Option v-for="(item,index) in dilitimeList" :value="item.label" :key="item.label">{{item.label}}</Option>
					</Select>
					<span>节</span>
					</Col>
				</Row>
				<Row style="width: 100%;text-align: center;">总课时:{{quanbu}}</Row>
			</Row>
			<Row style="text-align: center;">
				<Col span="24" style="margin-top:15px">
				<Button type="ghost" @click="cancel" icon="close-round" style="margin-right: 20px;">取消</Button>
				<Button v-if="this.title=='添加课时'?true:false" type="primary" @click="savesort" icon="checkmark-round">保存</Button>
				<Button v-if="this.title=='编辑课时'?true:false" type="primary" @click="editsavesort" icon="checkmark-round">保存</Button>
				</Col>
			</Row>
		</div>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				title:"",
				obj:"",
				listitemId:"",
				quanbu: "",
				lishitime: "",
				dilitime: "",
				zhengzhitime: "",
				wulitime: "",
				huaxuetime: "",
				shengwutime: "",
				chitime: "",
				mathtime: "",
				engtime: "",
				sortSettingHidden: false,
				grade: 1,
				addclass: "一班",
				zhengzhitimeList: [{
						value: 1,
						label: 0,
					},
					{
						value: 2,
						label: 1,
					},
					{
						value: 3,
						label: 2,
					},
					{
						value: 4,
						label: 3,
					},
					{
						value: 5,
						label: 4,
					},
					{
						value: 6,
						label: 5,
					},
					{
						value: 7,
						label: 6,
					},
					{
						value: 8,
						label: 7,
					},
					{
						value: 9,
						label: 8,
					},
					{
						value: 10,
						label: 9,
					},
					{
						value: 11,
						label: 10,
					},
				],
				lishitimeList: [{
						value: 1,
						label: 0,
					},
					{
						value: 2,
						label: 1,
					},
					{
						value: 3,
						label: 2,
					},
					{
						value: 4,
						label: 3,
					},
					{
						value: 5,
						label: 4,
					},
					{
						value: 6,
						label: 5,
					},
					{
						value: 7,
						label: 6,
					},
					{
						value: 8,
						label: 7,
					},
					{
						value: 9,
						label: 8,
					},
					{
						value: 10,
						label: 9,
					},
					{
						value: 11,
						label: 10,
					},
				],
				dilitimeList: [{
						value: 1,
						label: 0,
					},
					{
						value: 2,
						label: 1,
					},
					{
						value: 3,
						label: 2,
					},
					{
						value: 4,
						label: 3,
					},
					{
						value: 5,
						label: 4,
					},
					{
						value: 6,
						label: 5,
					},
					{
						value: 7,
						label: 6,
					},
					{
						value: 8,
						label: 7,
					},
					{
						value: 9,
						label: 8,
					},
					{
						value: 10,
						label: 9,
					},
					{
						value: 11,
						label: 10,
					},
				],
				shengwutimeList: [{
						value: 1,
						label: 0,
					},
					{
						value: 2,
						label: 1,
					},
					{
						value: 3,
						label: 2,
					},
					{
						value: 4,
						label: 3,
					},
					{
						value: 5,
						label: 4,
					},
					{
						value: 6,
						label: 5,
					},
					{
						value: 7,
						label: 6,
					},
					{
						value: 8,
						label: 7,
					},
					{
						value: 9,
						label: 8,
					},
					{
						value: 10,
						label: 9,
					},
					{
						value: 11,
						label: 10,
					},
				],
				huaxuetimeList: [{
						value: 1,
						label: 0,
					},
					{
						value: 2,
						label: 1,
					},
					{
						value: 3,
						label: 2,
					},
					{
						value: 4,
						label: 3,
					},
					{
						value: 5,
						label: 4,
					},
					{
						value: 6,
						label: 5,
					},
					{
						value: 7,
						label: 6,
					},
					{
						value: 8,
						label: 7,
					},
					{
						value: 9,
						label: 8,
					},
					{
						value: 10,
						label: 9,
					},
					{
						value: 11,
						label: 10,
					},
				],
				wulitimeList: [{
						value: 1,
						label: 0,
					},
					{
						value: 2,
						label: 1,
					},
					{
						value: 3,
						label: 2,
					},
					{
						value: 4,
						label: 3,
					},
					{
						value: 5,
						label: 4,
					},
					{
						value: 6,
						label: 5,
					},
					{
						value: 7,
						label: 6,
					},
					{
						value: 8,
						label: 7,
					},
					{
						value: 9,
						label: 8,
					},
					{
						value: 10,
						label: 9,
					},
					{
						value: 11,
						label: 10,
					},
				],
				engtimeList: [{
						value: 1,
						label: 0,
					},
					{
						value: 2,
						label: 1,
					},
					{
						value: 3,
						label: 2,
					},
					{
						value: 4,
						label: 3,
					},
					{
						value: 5,
						label: 4,
					},
					{
						value: 6,
						label: 5,
					},
					{
						value: 7,
						label: 6,
					},
					{
						value: 8,
						label: 7,
					},
					{
						value: 9,
						label: 8,
					},
					{
						value: 10,
						label: 9,
					},
					{
						value: 11,
						label: 10,
					},
				],
				mathtimeList: [{
						value: 1,
						label: 0,
					},
					{
						value: 2,
						label: 1,
					},
					{
						value: 3,
						label: 2,
					},
					{
						value: 4,
						label: 3,
					},
					{
						value: 5,
						label: 4,
					},
					{
						value: 6,
						label: 5,
					},
					{
						value: 7,
						label: 6,
					},
					{
						value: 8,
						label: 7,
					},
					{
						value: 9,
						label: 8,
					},
					{
						value: 10,
						label: 9,
					},
					{
						value: 11,
						label: 10,
					},
				],
				chitimeList: [{
						value: 1,
						label: 0,
					},
					{
						value: 2,
						label: 1,
					},
					{
						value: 3,
						label: 2,
					},
					{
						value: 4,
						label: 3,
					},
					{
						value: 5,
						label: 4,
					},
					{
						value: 6,
						label: 5,
					},
					{
						value: 7,
						label: 6,
					},
					{
						value: 8,
						label: 7,
					},
					{
						value: 9,
						label: 8,
					},
					{
						value: 10,
						label: 9,
					},
					{
						value: 11,
						label: 10,
					},
				],
				addclassList: [{
						value: 1,
						label: "一班"
					},
					{
						value: 2,
						label: "二班"
					},
					{
						value: 3,
						label: "三班"
					},
					{
						value: 4,
						label: "四班"
					},
					{
						value: 5,
						label: "五班"
					},
				],
				gradeList: [{
						value: 1,
						label: "高一",
					},
					{
						value: 2,
						label: "高二",
					},
					{
						value: 3,
						label: "高三",
					},
					{
						value: 4,
						label: "初一",
					},
					{
						value: 5,
						label: "初二",
					},
					{
						value: 6,
						label: "初三",
					},

				],
				manageList: [{
						itemId: "01",
						classes: "一班",
						alltime: "40",
						chi: "7",
						shuxue: "7",
						eng: "7",
						zhengzhi: "3",
						lishi: "3",
						dili: "3",
						wuli: "3",
						huaxue: "3",
						shengwu: "4",

					},
					{
						itemId: "02",
						classes: "二班",
						alltime: "41",
						chi: "7",
						shuxue: "7",
						eng: "7",
						zhengzhi: "3",
						lishi: "3",
						dili: "3",
						wuli: "3",
						huaxue: "4",
						shengwu: "4",

					},
					{
						itemId: "03",
						classes: "三班",
						alltime: "40",
						chi: "7",
						shuxue: "7",
						eng: "7",
						zhengzhi: "3",
						lishi: "4",
						dili: "3",
						wuli: "3",
						huaxue: "3",
						shengwu: "3",

					},
					{
						itemId: "04",
						classes: "四班",
						alltime: "45",
						chi: "7",
						shuxue: "7",
						eng: "7",
						zhengzhi: "4",
						lishi: "4",
						dili: "4",
						wuli: "4",
						huaxue: "4",
						shengwu: "4",

					},
					{
						itemId: "05",
						classes: "五班",
						alltime: "40",
						chi: "7",
						shuxue: "7",
						eng: "7",
						zhengzhi: "3",
						lishi: "3",
						dili: "3",
						wuli: "3",
						huaxue: "3",
						shengwu: "4",

					},

				],
			}
		},
		created() {

		},
		methods: {
			gradeChange: function() {},
			addtime: function() {
				this.title="添加课时"
				this.sortSettingHidden = true
				this.lishitime = 0
				this.dilitime = 0
				this.zhengzhitime = 0
				this.wulitime = 0
				this.huaxuetime = 0
				this.shengwutime = 0
				this.chitime = 0
				this.mathtime = 0
				this.engtime = 0
				this.addclass = "一班"
				this.quanbu = this.chitime + this.mathtime + this.engtime + this.zhengzhitime + this.lishitime + this.dilitime + this.huaxuetime + this.shengwutime + this.wulitime
			},
			xkpkedit: function(index) {
				this.title="编辑课时"
				this.obj=index
				this.sortSettingHidden = true
				this.listitemId=this.manageList[index].itemId
				this.lishitime = this.manageList[index].lishi
				this.dilitime = this.manageList[index].dili
				this.zhengzhitime = this.manageList[index].zhengzhi
				this.wulitime = this.manageList[index].wuli
				this.huaxuetime = this.manageList[index].huaxue
				this.shengwutime = this.manageList[index].shengwu
				this.chitime = this.manageList[index].chi
				this.mathtime = this.manageList[index].shuxue
				this.engtime = this.manageList[index].eng
				this.addclass = this.manageList[index].classes
				this.quanbu = this.manageList[index].alltime
			},
			addclassChange: function() {},
			xkpkdel: function(index) {
				this.manageList.splice(index, 1)
			},
			savesort: function() {
				this.manageList.push({
					itemId: "0" + (this.manageList.length + 1),
					classes: this.addclass,
					alltime: this.quanbu,
					chi: this.chitime,
					shuxue: this.mathtime,
					eng: this.engtime,
					zhengzhi: this.zhengzhitime,
					lishi: this.lishitime,
					dili: this.dilitime,
					wuli: this.wulitime,
					huaxue: this.huaxuetime,
					shengwu: this.shengwutime,
				})
				this.sortSettingHidden = false
				alert("保存成功")
			},
			cancel: function() {
				this.sortSettingHidden = false
			},
			chitimeChange: function() {
				this.quanbu = this.chitime + this.mathtime + this.engtime + this.zhengzhitime + this.lishitime + this.dilitime + this.huaxuetime + this.shengwutime + this.wulitime
			},
			mathtimeChange: function() {
				this.quanbu = this.chitime + this.mathtime + this.engtime + this.zhengzhitime + this.lishitime + this.dilitime + this.huaxuetime + this.shengwutime + this.wulitime
			},
			engtimeChange: function() {
				this.quanbu = this.chitime + this.mathtime + this.engtime + this.zhengzhitime + this.lishitime + this.dilitime + this.huaxuetime + this.shengwutime + this.wulitime
			},
			wulitimeChange: function() {
				this.quanbu = this.chitime + this.mathtime + this.engtime + this.zhengzhitime + this.lishitime + this.dilitime + this.huaxuetime + this.shengwutime + this.wulitime
			},
			huaxuetimeChange: function() {
				this.quanbu = this.chitime + this.mathtime + this.engtime + this.zhengzhitime + this.lishitime + this.dilitime + this.huaxuetime + this.shengwutime + this.wulitime
			},
			shengwutimeChange: function() {
				this.quanbu = this.chitime + this.mathtime + this.engtime + this.zhengzhitime + this.lishitime + this.dilitime + this.huaxuetime + this.shengwutime + this.wulitime
			},
			zhengzhitimeChange: function() {
				this.quanbu = this.chitime + this.mathtime + this.engtime + this.zhengzhitime + this.lishitime + this.dilitime + this.huaxuetime + this.shengwutime + this.wulitime
			},
			lishitimeChange: function() {
				this.quanbu = this.chitime + this.mathtime + this.engtime + this.zhengzhitime + this.lishitime + this.dilitime + this.huaxuetime + this.shengwutime + this.wulitime
			},
			dilitimeChange: function() {
				this.quanbu = this.chitime + this.mathtime + this.engtime + this.zhengzhitime + this.lishitime + this.dilitime + this.huaxuetime + this.shengwutime + this.wulitime
			},
			editsavesort:function(){
				this.manageList.splice(this.obj, 1, {
					itemId: this.listitemId,
					classes: this.addclass,
					alltime: this.quanbu,
					chi: this.chitime,
					shuxue: this.mathtime,
					eng: this.engtime,
					zhengzhi: this.zhengzhitime,
					lishi: this.lishitime,
					dili: this.dilitime,
					wuli: this.wulitime,
					huaxue: this.huaxuetime,
					shengwu: this.shengwutime,
				})
				this.sortSettingHidden = false
				alert("保存成功")
			},
		},
	}
</script>

<style>

</style>